<template>
	<view class="container">
		<view class="form">
			<uni-forms ref="formRef" :model="form" label-position="top" label-width="88px">
				<uni-row>
					<uni-col :span="12">
						<uni-forms-item label="操作模块：">
							<view class="text-wrap">{{ form.title }} / {{ typeFormat(form) }}</view>
						</uni-forms-item>
						<uni-forms-item label="登录信息：">
							<view class="text-wrap">{{ form.operName }} / {{ form.operIp }} </view>
						</uni-forms-item>
					</uni-col>
					<uni-col :span="12">
						<uni-forms-item label="请求地址：">
							<view class="text-wrap">{{ form.operUrl }}</view>
						</uni-forms-item>
						<uni-forms-item label="请求方式：">
							<view class="text-wrap">{{ form.requestMethod }}</view>
						</uni-forms-item>
					</uni-col>
					<uni-col :span="24">
						<uni-forms-item label="操作方法：">
							<view class="text-wrap">{{ form.method }}</view>
						</uni-forms-item>
					</uni-col>
					<uni-col :span="24">
						<uni-forms-item label="请求参数：">
							<view class="text-wrap">{{ form.operParam }}</view>
						</uni-forms-item>
					</uni-col>
					<uni-col :span="24">
						<uni-forms-item label="返回参数：">
							<view class="text-wrap">{{ form.jsonResult }}</view>
						</uni-forms-item>
					</uni-col>
					<uni-col :span="8">
						<uni-forms-item label="操作状态：">
							<view class="text-wrap">
								<div v-if="form.status === 0">正常</div>
								<div v-else-if="form.status === 1">失败</div>
							</view>
						</uni-forms-item>
					</uni-col>
					<uni-col :span="8">
						<uni-forms-item label="消耗时间：">
							<view class="text-wrap">{{ form.costTime }}毫秒</view>
						</uni-forms-item>
					</uni-col>
					<uni-col :span="8">
						<uni-forms-item label="操作时间：">
							<view class="text-wrap">{{ parseTime(form.operTime) }}</view>
						</uni-forms-item>
					</uni-col>
					<uni-col :span="24">
						<uni-forms-item label="异常信息：" v-if="form.status === 1">
							<view class="text-wrap">{{ form.errorMsg }}</view>
						</uni-forms-item>
					</uni-col>
				</uni-row>
			</uni-forms>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,
		getCurrentInstance
	} from 'vue'
	import {
		onLoad,
		onUnload
	} from '@dcloudio/uni-app'
	const {
		proxy
	} = getCurrentInstance();
	const {
		sys_oper_type,
		sys_common_status
	} = proxy.useDict("sys_oper_type", "sys_common_status");

	/** 表单数据 */
	const form = ref({});

	onLoad((params) => {
		uni.setNavigationBarTitle({
			title: params.title
		});
		uni.$once('update', function(data) {
			form.value = data;
		})
	})

	/** 操作日志类型字典翻译 */
	function typeFormat(row, column) {
		return proxy.selectDictLabel(sys_oper_type.value, row.businessType);
	}
</script>

<style lang="scss">
	@import "@/static/scss/work/form.scss";

	.text-wrap {
		word-break: break-all;
		/* 允许在单词内换行 */
		overflow-wrap: break-word;
		/* 在长单词或URL地址内部进行换行 */
	}
</style>